<%@ page import="java.util.*" %>
<%@ page import="gz.Music" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    <meta charset="UTF-8">
  <title>index.jsp</title>
</head>
<body>
<div class="container-fluid">
    <%--头部欢迎--%>

        <div class="row">
            <div class="col-xs-12 col-sm-6 col-md-11">${name},欢迎您!</div>
            <div class="col-xs-6 col-md-1">
                <form action="login.jsp" method="post">
                    <button class="btn btn-default" type="submit">退出登录</button>
                </form>
            </div>
        </div>
    <%--头部欢迎--%>
        <div class="row">
            <div class="col-md-4"></div>
            <div class="col-md-4"><h2>个人音乐列表</h2></div>
            <div class="col-md-4"></div>
        </div>
        <div class="row">
            <div class="col-md-2"></div>
        <div class="col-md-8">
            <table class="table table-hover">
                <thead>
                    <tr>
                        <th>id</th>
                        <th>歌曲名</th>
                        <th>歌手</th>
                        <th>点击率</th>
                        <th>修改|删除</th>
                    </tr>
                </thead>
                <tbody>
                <%
                    List<Music> musices=new ArrayList<>();
                    musices= (List<Music>) request.getAttribute("music");
                    for (int i=0;i<musices.size();i++) {
                        Music music=musices.get(i);
                    %>
                    <tr>
                        <th><%=i+1%></th>
                        <th><%=music.getMusicName()%></th>
                        <th><%=music.getSinger()%></th>
                        <th><%=music.getHint()%></th>
                        <th><a class="text-primary" href="setmusic.jsp?id=<%=music.getId()%>&musicName=<%=music.getMusicName()%>&singer=<%=music.getSinger()%>&hint=<%=music.getHint()%>" >修改</a>
                            |
                            <a id="del" class="text-primary" onclick="del(<%=music.getId()%>)">删除</a>
                        </th>
                    </tr>
                <%
                }
                %>
                </tbody>
                <tfoot>
                <tr>
                    <th></th>
                    <th></th>
                    <th></th>
                    <th></th>
                    <th><form action="addmusic.jsp" method="post">
                        <button class="btn btn-default" type="submit">添加</button>
                    </form></th>
                </tr>
                </tfoot>
            </table>
        </div>
            <div class="col-md-2"></div>
        </div>
</div>

</body>
</html>

<script>
    function del(id) {
        if (confirm("是否删除该歌曲")){
            location.href="DeleteServlet?id="+id;
        }
    };
</script>